
<script type="text/javascript">
    $(function () {
        $(".hover td").hover(function () {
            $(this).find("div").show();
        }, function () {
            $(this).find("div").hide();
        });
    });
</script>
<style type="text/css">
    #show_op{
        position: fixed;
        max-height: 300px;
        overflow: auto;
    }
    #show_op table{
        border-collapse:collapse;
        border-color:#999;
        background: rgb(236, 187, 187);
        border:1px solid #fff;
    }
    #show_op table th{
        padding: 5px;
        font-weight: bold;
        text-align: center;
        border-color: #fff;
    }
    #show_op table td{
        min-width: 80px;
        text-align: center;
        padding: 5px;
        border-color: #fff;
        vertical-align: top;
    }
    .hover.on{
        background: rgb(232, 232, 232);
    }
</style>

<div id="show_op" style="display: none;z-index:100;">
    <table border="" cellspacing="0" cellpadding="0">
        <tr>
            <th width="80">商品图片</th>
            <th width="180">名称</th>
            <th>价格</th>
            <th>数量</th>
            <th>属性</th>
        </tr>
        <tr>
            <td><img style="width: 80px;display: block;" src="img/login-banner.jpg"/></td>
            <td>￥00</td>
            <td>1</td>
            <td>白色</td>
            <td>￥00</td>
        </tr>
    </table>
</div>

<div class="admin">
    <div class="tab panel dux-box admin-panel">
        <div class="panel-head"><strong>订单管理</strong></div>
        <div class="fixed-empty"></div>
        <form method="get" action="{:U('index')}" name="formSearch" id="formSearch">   
            <div class="table-tools clearfix ">
                <div class="float-left">
                    <div class="form-inline">
                        <div class="form-group">
                            <div class="field"><label>订单号：</label><input class="input input_small" type="text" name="order_sn" value="" /></div>
                            <div class="field"><label>店铺：</label><input class="input input_small" type="text" name="store_name" value="" /></div>
                            <div class="field"><label>下单时间：</label>
                                <input class="input input_big hasDatepicker" type="text" value="" id="query_start_time" name="query_start_time" readonly="readonly">至
                                <input class="input input_big hasDatepicker" type="text" value="" id="query_end_time" name="query_end_time" readonly="readonly">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="table-tools clearfix ">
                <div class="float-left">
                    <div class="form-inline">
                        <div class="form-group">

                            <div class="field"><label>收货人：</label><input class="input input_small" type="text" name="buyer_name" value="" /></div>
                            <div class="field"><label>付款方式：</label>
                                <select name="payment_code" class="querySelect">
                                    <option value="">请选择</option>
                                    <option value="alipay">支付宝</option>
                                    <option value="weixin">微信</option>
                                    <option value="chinabank">网银在线</option>
                                </select>
                            </div>
                            <div class="field"><label>订单状态：</label>
                                <select name="order_state" class="querySelect">
                                    <option value="0">全部订单</option>
                                    <option value="10">待付款</option>
                                    <option value="20">待发货</option>
                                    <option value="30">已发货</option>
                                    <option value="40">交易完成</option>
                                    <option value="0">已取消</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-button">
                            <button class="button bg-blue" type="submit">查询</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
        <form method="get" action="{:U('Excel/expUserExcel',array('gid'=>$gid))}" name="formSearch" id="formSearch">
            <div class="table-tools clearfix ">
                <div style="text-align:right;">
                    <input  class="button bg-main" type="submit" value="导出Excel" />
                </div>
            </div>
        </form>
        <table class="table tb-type2 nobdb">
            <thead>
                <tr class="thead">
                    <th>订单号</th>
                    <th>支付单号</th>
                    <th>店铺</th>
                    <th>买家</th>
                    <th class="align-center">下单时间</th>
                    <th class="align-center">订单总额</th>
                    <th class="align-center">支付方式</th>
                    <th class="align-center">订单来源</th>
                    <th class="align-center">订单状态</th>
                    <th class="align-center">操作</th>
                </tr>
            </thead>
            <tbody>
            <foreach item="v" name="arr" key='k'>
                <tr class="hover" style="background: rgb(255, 255, 255);">
                    <td class="oGoods" id="{$v['order_id']}">{$v['order_sn']}</td>
                    <td>{$v['pay_sn']}</td>
                    <td>{$v['store_name']}</td>
                    <td>{$v['user_name']}</td>
                    <td class="nowrap align-center">{$v['add_time']|date="Y-m-d H:i:s",###}</td>
                    <td class="align-center">{$v['order_amount']}</td>
                    <td class="align-center">{$v['payment_code']}</td>
                    <td class="align-center">weixin</td>
                    <td class="align-center">
                <switch name="v.order_state"><case value="0" break="0">已取消</case>
                <case value="10" break="1">待付款</case>
                <case value="20" break="1">待发货</case>
                <case value="30" break="1">已付款</case>
                <case value="40" break="1">已完成</case>
                </switch>
                </td>
                <td class="w144 align-center">
                    <a href="{:U('Order/details',array('order_id'=>$v['order_id']))}">详情</a>
                    <!-- 取消订单 -->
                    | <a class="js-del" href="javascript:;" data="1" title="确定退款">确定退款</a>
                </td>
                </tr>
            </foreach>
            </tbody>
            <tfoot class="panel-foot">
                <tr>
                    <td colspan="15"><div class="pages clearfix">{$pages}</div></td>
                </tr>
            </tfoot>
        </table>
    </div>
</div>
<script type="text/javascript">
    $('#myform').layer({
        actionUrl: "batchAction",
        deleteUrl: "del",
    });
    $('#query_start_time').duxTime({
        timepicker: false,
    });
    $('#query_end_time').duxTime({
        timepicker: false,
    });
</script>

<script type="text/javascript">
    var objtop;
    var time;
    var panduan;
    $(".oGoods").hover(function () {
        objtop = $(this).offset().top - $(document).scrollTop();
        var order_id = $(this).attr('id');
        console.log(top);
        $.ajax({
            url: "{:U('getGoods')}", //请求数据ajax地址
            dataType: "json",
            type: 'POST',
            data: {order_id: order_id},
            success: function (result) {
                $("#show_op tr").eq(0).nextAll().remove();
                $("#show_op table").append(result.str);
                $("#show_op").stop(false, true);
                $("#show_op").show();
                clearTimeout(time);
                time = setTimeout(func, "3000");//三秒后执行
                $("#show_op").css("top", objtop + 30);
                $("#show_op").css("left", "150px");
            }
        })
    });
    function func()
    {
        $("#show_op").fadeOut(3000);
    }
    $("#show_op").hover(function () {
        clearTimeout(time);
    }, function () {
        $("#show_op").hide();
    })
</script>